<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/mui.min.css" />
    <link rel="stylesheet" href="css/login.css" />
    <style type="text/css">
      .setting {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 15px;
        right: 15px;
      }

      .tabNav {
        margin: 20px 0;
        display: flex;
        align-items: center;
        /* border-bottom:1px solid #ccc; */
      }

      .tabNav .tabList {
        flex: 1;
        text-align: center;
      }

      .tabNav .tabList span {
        padding: 15px;
        display: inline-block;
      }

      .tabNav .tabList.active {
        color: #004a86;
      }

      .tabNav .tabList.active span {
        border-bottom: 2px solid #004a86;
      }

      #page {
        height: 100%;
      }
    </style>
  </head>

  <body>
    <div id="page">

      <div class="mui-content">
        <div id="middle_box">
          <!-- <img src="img/seting.png" class="setting" id="setting"> -->
          <img src="img/login_logo.png" alt="" class="logo" />
          <div class="tabNav">
            <div class="tabList" @click="tab(0)" :class="tabIndex===0?'active':''"><span>内部人员</span></div>
            <div class="tabList" @click="tab(1)" :class="tabIndex===1?'active':''"><span>外来人员</span></div>
          </div>
          <div v-show="tabIndex===0">
            <form class="mui-input-group">
              <div class="mui-input-row">
                <span id="phone_icon"></span>
                <input type="text" placeholder="请输入工号" id="account" value="" maxlength="45">
              </div>
              <div class="mui-input-row mui-password" style="position: relative;">
                <span id="lock_icon"></span>
                <div id="lookPwd">
                  <img src="img/login_pasno.png" class="pass_img" id="pass" />
                </div>

                <input type="password" placeholder="请输入密码" id="password" class="pwdasdasd" value="" maxlength="45">
              </div>
            </form>
            <div id="taggle">
              <span id="forget">
                记住密码
              </span>
              <div class="mui-switch mui-switch-mini mui-switch-blue" >
                <div class="mui-switch-handle"></div>
              </div>
            </div>

            <button type="button" class="btn" id="login_btn">登录</button>

          </div>
          <div v-show="tabIndex===1">
            <form class="mui-input-group">
              <div class="mui-input-row">
                <span id="phone_icon"></span>
                <input type="text" placeholder="请输入账号" value="" maxlength="45" v-model="user">
              </div>
              <div class="mui-input-row mui-password" style="position: relative;">
                <span id="lock_icon"></span>
                <div id="seePwd">
                  <img src="img/login_pasno.png" class="pass_img" id="passImg" />
                </div>

                <input type="password" placeholder="请输入密码" class="pwdasdasd" value="" maxlength="45" v-model="password">
              </div>
              
            </form>
            <div id="taggle">
              <span id="forget">
                记住密码
              </span>
              <div class="mui-switch mui-switch-mini mui-switch-blue" id="remember">
                <div class="mui-switch-handle"></div>
              </div>
            </div>
            <button type="button" class="btn" @click="submit()">登录</button>
          </div>
          <p class="version">当前版本号：<span id="version"></span></p>

          <p style="text-align: center;"id="registerDiv">
            <a href="###" id="register">注册新用户</a> | <a href="###" @click="enter()">入场登记</a>
          </p>
        </div>
      </div>
      <div id="selectRegisterType" style="display: none;">
        <div class="title"><span class="mui-icon mui-icon-compose"></span><span>请选择注册类型</span></div>
        <div class="mui-row radio" style="height: auto;">
          <div class="mui-col-xs-6 radio_left kind">
            <div class="mui-input-row mui-radio mui-left">
              <label>内部员工</label>
              <input type="radio" name="kind" value="1" checked="checked" />
            </div>
          </div>
          <div class="mui-col-xs-6 radio_right">
            <div class="mui-input-row mui-radio mui-left kind">
              <label>承包商</label>
              <input type="radio" name="kind" value="0" />
            </div>
          </div>
          <!-- <div class="mui-col-xs-6 radio_right">
            <div class="mui-input-row mui-radio mui-left kind">
              <label>外来人员</label>
              <input type="radio" name="kind" value="2" />
            </div>
          </div> -->
        </div>
        <div class="neibu1">
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>板块</label>
            <input type="radio" name="detail" />
          </div>
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>分公司</label>
            <input type="radio" name="detail" />
          </div>
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>电站</label>
            <input type="radio" name="detail" />
          </div>
        </div>
        <div class="neibu2" style="display: none;">
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>主机厂家</label>
            <input type="radio" name="detail" />
          </div>
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>外维承包商</label>
            <input type="radio" name="detail" />
          </div>
          <div class="mui-input-row mui-radio mui-left radio1">
            <label>其他</label>
            <input type="radio" name="detail" />
          </div>
        </div>
        <div class="confirm">确认</div>
      </div>

    </div>
  </body>
  <script src="../../js/mui.min.js"></script>
  <script src="../../js/jquery-3.2.1.min.js"></script>
  <script src="../../js/mkeyplus.base.js"></script>
  <script src="../../js/common.js"></script>
  <script type="text/javascript" src="../../js/vue.js"></script>
  <script src="../neom/js/mkeyplus.base.js"></script>
  <script type="text/javascript" charset="utf-8">
    //				  localStorage.clear();
    var username = ""; // 用户名
    var password_ = ""; //密码
    var val = "";
    var val1 = "";
    var Org = []; // 获取所有的
    var nameTemp = null; // 用户名缓存
    var pwdTemp = null; // 密码缓存
    var mask = null;
    var self;
    var pwd = ""; // 从注册页回填过来的密码
    var name_ = null; // 从注册界面回天过来的用户名
    var first = null; //第一次点击backbutton
    var auto = ""; //第一次点击backbutton
    var loginPage = null;
    mui.init();
    home = new Vue({
      el: '#page',
      data: {
        tabIndex: 1,
        user: '',
        password: ''
      },
      created: function() {},
      methods: {
        tab(type) {
          this.tabIndex = type
        },
        enter(){
          mui.openWindow({
            url: '../neom/record/form.html',
            id: '../neom/record/form.html',
          });
        },
        submit() {
          var that = this;
          if (that.user == "") {
            mui.toast('请输入用户名!');
            return;
          }
          if (that.password == "") {
            mui.toast('请输入密码!');
            return;
          }
          mui.baseWApp.httpRequst('/app/login', {
            phone: that.user,
            password: that.password
          }, function(data) {
            plus.nativeUI.closeWaiting();
            console.log(JSON.stringify(data))
            if(data.code=='0'){
              localStorage.setItem('outUserId', data.data.id);
              localStorage.setItem("outUser", JSON.stringify(data.data));
              mui.openWindow({
                url: '../neom/home.html',
                id: '../neom/home.html',
              });
            }else{
              mui.toast(data.msg)
            }
          }, function() {
            plus.nativeUI.closeWaiting();
            console.log("登录失败");
          }, 'post');
        }
      }
    })
    mui.plusReady(function() {

      self = plus.webview.currentWebview();
      //关闭loading页面
      //			if(self.opener()){}
      //			self.opener().close();
      pwd = self.pwd;
      name_ = self.name_;
      auto = self.auto;

      //				alert('111');
      //创建遮罩蒙版
      nameTemp = localStorage.getItem('uname');
      pwdTemp = localStorage.getItem('pwd');
      console.log('91====' + nameTemp + '===' + pwdTemp);
      if (name_ == undefined) {
        if (nameTemp == null) {
          nameTemp = "";
        } else {
          $('#account').val(nameTemp);
        }

      } else {
        $('#account').val(name_);
      }

      if (pwd) {
        $('#password').val(pwd);
      } else {
        if (pwdTemp == null || pwdTemp == "") {
          pwdTemp = "";
          $('#password').val("");
        } else {
          $('#password').val(pwdTemp);
          $('#remember').addClass('mui-active');
        }
      }

      localStorage.setItem('pwd', password_);

      console.log("name===" + name_);
      console.log("pwd" + pwd);
      mask = mui.createMask(function() {
        $('#selectRegisterType').hide();
      });
      getVersion();

      function getVersion() {
        plus.runtime.getProperty(plus.runtime.appid, function(inf) { //判断是否有忽略的版本
          var temp = inf.version;
          //		 	localStorage.setItem("currVersion",temp);
          $('#version').html(temp);
        });
      }

      //点击登录
      $('#login_btn').on('tap', function() {
        if (plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE) {
          var btnArr = ['确认', '取消'];
          mui.confirm('当前无网络,是否继续登录?', '提示', btnArr, function(e) {
            if (e.index == 0) {
              var storageName = localStorage.getItem('uname');
              if ($('#account').val() != storageName) {
                mui.toast('当前账号与本地存储账号不一致无法登录');
                return;
              }
              mui.openWindow({
                url: '../../index1.html',
                id: 'index1.html',
                extras: {
                  network: 0
                }
              });
            }
          });
        } else {
          login();
        }

      });
      //点击注册
      $('#register').on('tap', function() {
        register();
      });
      //点击注册模板的确认按钮
      $('.confirm').on('tap', function() {
        btnConfirm();
      });
      //			rememberInfo();
      tabType();
      //			rememberPwd();
    });
    // 登录
    function login() {

      username = $('#account').val();
      console.log('193-----用户名======' + username);
      localStorage.setItem('uname', username);
      password_ = $('#password').val();
      console.log('密码=====' + password_);
      if (username == "") {
        mui.toast('请输入用户名!');
        return;
      }
      if (password_ == "") {
        mui.toast('请输入密码!');
        return;
      }
      plus.nativeUI.showWaiting('登录中...');
      mui.baseApp.httpRequst('/api/v2/users/login', {
        username: username,
        password: password_
      }, function(data) {
        plus.nativeUI.closeWaiting();
        if (data.status == "200") {
          console.log('登录成功=====' + JSON.stringify(data.data));
          var data = data.data;
          console.log('userid======' + data.rolesstr);
          localStorage.setItem('xingming', data.name);
          console.log(localStorage.getItem('xingming'));
          localStorage.setItem('userid', data.id);
          localStorage.setItem('unit', data.unit);
          localStorage.setItem('username', data.username);
          localStorage.setItem('rolesStr', data.rolesstr);
          localStorage.setItem("windName", JSON.stringify(data.windname));
          console.log('windName++++' + localStorage.getItem('windName'));
          if ($('#remember').hasClass('mui-active')) {
            password_ = $('#password').val();

            localStorage.setItem('pwd', password_);
            console.log('225===' + password_);

          } else {
            localStorage.removeItem("pwd");
          }
          mui.openWindow('../../index1.html');
          //获取token
          // console.log(Config.ddmsUrl)
          // mui.ajax(Config.ddmsUrl+'/auth/login',{
          // 	data:{
          // 		username:username,
          // 		password:password_
          // 	},
          // 	dataType:'json',//服务器返回json格式数据
          // 	type:'post',//HTTP请求类型
          // 	timeout:10000,//超时时间设置为10秒；
          // 	headers:{'Content-Type':'application/json'},	              
          // 	success:function(data){
          //     if($('#remember').hasClass('mui-active')) {
          //     	password_ = $('#password').val();

          //     	localStorage.setItem('pwd', password_);
          //     	console.log('225===' + password_);

          //     }else{
          //     	localStorage.removeItem("pwd");
          //     }
          //     localStorage.setItem("token",data.token);
          // 		mui.openWindow('../../index1.html');
          // 	},
          // 	error:function(xhr,type,errorThrown){
          // 		//异常处理；
          //     mui.toast(JSON.parse(xhr.responseText).message)
          // 		console.log(type);
          // 	}
          // });
        } else if (data.status == "400") {
          mui.toast('用户名或密码错误,请重新输入!');
        } else if (data.status == "409") {
          mui.toast('用户名或密码错误,请重新输入!');
        } else if (data.status == "403") {
          mui.toast(data.message);
        }
      }, function() {
        plus.nativeUI.closeWaiting();
        console.log("登录失败");
      });

    }
    //注册
    function register() {
      mask.show();
      $('#selectRegisterType').show();
    }
    //设置密码可见
    document.getElementById("lookPwd").addEventListener("tap", function() {
      if ($(".pwdasdasd")[0].type == "password") {
        $(".pwdasdasd")[0].type = "text";
        $("#pass").attr('src', 'img/login_pasY.png');
      } else {
        $("#pass").attr('src', 'img/login_pasno.png');
        $(".pwdasdasd")[0].type = "password";
      }
    });
    //设置密码可见
    document.getElementById("seePwd").addEventListener("tap", function() {
      if ($(".pwdasdasd")[1].type == "password") {
        $(".pwdasdasd")[1].type = "text";
        $("#passImg").attr('src', 'img/login_pasY.png');
      } else {
        $("#passImg").attr('src', 'img/login_pasno.png');
        $(".pwdasdasd")[1].type = "password";
      }
    });
    // 切换注册类型
    function tabType() {
      mui.each(mui('.kind'), function(i, v) {
        v.addEventListener('tap', function() {
          if ($(this).find('input').val() == "1") {
            $('.neibu1').show();
            $('.neibu2').hide();
          } else if ($(this).find('input').val() == "0") {
            $('.neibu1').hide();
            $('.neibu2').show();
          } else if ($(this).find('input').val() == "2") {
            mui.openWindow({
              url: './registerW.html',
              id: 'registerW.html',
            });
            mask.close();
            $('#selectRegisterType').hide();
          }
        });
      });
    }
    // 点击确认
    function btnConfirm() {
      val = $('input:radio[name="detail"]:checked').prev().text();
      val1 = $('input:radio[name="kind"]:checked').val();
      console.log('val-----' + val);
      console.log('val1-----' + val1);
      if ((val == null || val == "") || (val1 == null || val1 == "")) {
        mui.toast('请选择注册类型!');
      } else if(val1=='0'){
        mui.openWindow({
          url: './registerW.html',
          id: 'registerW.html',
        });
      }else {
        mask.close();
        $('#selectRegisterType').hide();
        mui.openWindow({
          url: 'register.html',
          id: 'register.html',
          extras: {
            val: val,
            val1: val1
          }
        });
      }
    }

    //监听返回按钮，连续点击两次退出程序
    mui.back = function() {
      //首次按键，提示‘再按一次退出应用’
      if (!first) {
        first = new Date().getTime();
        mui.toast('再按一次退出应用');
        setTimeout(function() {
          first = null;
        }, 800);
      } else {
        if (new Date().getTime() - first < 1000) {
          plus.runtime.quit();
        }
      }
    }

    $("#setting").on("tap", function() {
      var ip = localStorage.getItem('postIp') ? localStorage.getItem('postIp') : '';
      mui.prompt('当前IP：' + ip, '请输入要设置的IP', 'IP设置', ['确定', '取消', '重置'], function(e) {
        if (e.index == 1) {
          return
        }
        if (e.index == 2) {
          localStorage.removeItem('postIp');
          location.reload();
        }
        if (e.index == 0) {
          if (e.value != '') {
            localStorage.setItem('postIp', e.value);
            location.reload();
          }
        }
      })
    })
    //自动登录
    /*function autologin(username, userpwd) {
			localStorage.setItem('uname', username);
			plus.nativeUI.showWaiting('登录中...');
			mui.baseApp.httpRequst('/api/v2/users/login', {
				username: '' + username,
				password: '' + userpwd
			}, function(data) {
				plus.nativeUI.closeWaiting();
				if(data.status == "200") {
					console.log('登录成功=====' + JSON.stringify(data.data));
					var data = data.data;
					console.log('userid======' + data.id);
					localStorage.setItem('userid', data.id);
					localStorage.setItem('unit', data.unit);
					localStorage.setItem('username', data.username);
					localStorage.setItem("windName",JSON.stringify(data.windname));
					console.log('windName++++'+localStorage.getItem('windName'));
					mui.openWindow('../../index1.html');
				} else if(data.status == "400") {
					mui.toast('密码错误,请重新输入!');
					mui.baseApp.openWindow("../login/login.html");
				} else if(data.status == "409") {
					mui.toast('您输入的用户名不存在!');
					mui.baseApp.openWindow("../login/login.html");
				}
				//					loginnum = 0;	
			}, function() {
				$("#loading").css("display", "none"); //loading隐藏 
				mui.baseApp.openWindow("../login/login.html");
			});

		}
//		var b = new Base64();
		//登录或者跳转登录
		function cancelupdate() {
			var username = localStorage.getItem("username"); //取出用户名缓存
			var userpwd = localStorage.getItem("pwd");  //取出用户名缓存
//			userpwd = b.decode(userpwd);
			console.log('密码++++' + userpwd);
			if(username != null){
				$('#account').val(username);
			}
			if(username != null && userpwd != null) { //如果账号密码不为空，尝试登陆
				$('#account').val(username);
				$('#password').val(userpwd);
				if(plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE) {
					
				}else{
					autologin(username, userpwd); //登录方法
				}
				
			} else { //自动登录失败，进入登录页
			}
		}*/

    //		function getUsername(){
    //			$('#account').val(localStorage.getItem('uname'));
    //		}
    // 判断是否记住密码
    //		function rememberPwd() {
    //			if($('#remember').hasClass('mui-active')) {
    //				password_ = $('#password').val();
    //				console.log('225===' + password_);
    //				localStorage.setItem('pwd', password_);
    //			}
    //		}
    //		// 记住用户名
    //		function rememberInfo() {
    //			$('#remember').on('tap', function() {
    //				if($(this).hasClass('mui-active') && (flag == 1)) {
    //					//					password_ = $('#password').val();
    //					//					console.log('225===' + password_);
    //					//					localStorage.setItem('pwd', password_);
    //				}
    //			});
    //		}
  </script>

</html>
